<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="Keywords" Content="婚礼包办,婚礼策划，爱情,蜜月,婚礼用品">
		<meta name="Description" Content="为用户提供婚礼策划、婚车租赁、婚纱摄影、蜜月旅行以及周边服务商品的商城，为用户提供一站式解决方案，解决用户在婚礼各个环节中遇到的困难。">
		<link rel="shortcut icon" type="image/x-icon" href="../img/static/shemher.ico" media="screen" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>相合网_高品质婚礼服务</title>
		<link rel="stylesheet" type="text/css" href="../css/mod/base.css" />
		<link rel="stylesheet" type="text/css" href="../css/page/log_reg.css" />
	</head>

	<body>
		<div class="register-bg">
			<img src="../img/online/reg-img.png" />
		</div>
		<div class="wrap">
			<div class="search-logo">
				<a href="home.html" class="mod-sprites mt30">
				</a>
			</div>
			<div class="register">
				<div class="reg-form">
					<h1 class="reg-title">注册</h1>
					<form action="" method="post" id="register-form">
						<ul>
							<li><label for="">手机号</label><input type="text" name="phonenum" id="phonenum" value="" class="w330" /></li>
							<li><label for="">短信验证码</label><input type="text" name="phonever" id="phonever" value="" />
								<a class="reg-btn w130 h50 fr" id="hqyzm">获取验证码</a>
							</li>
							<li><label for="">设置密码</label><input type="password" name="password" id="password" class="w330" placeholder="6-18位大小写字母或者数字" /></li>
							<li><label for="">确认密码</label><input type="password" name="repassword" id="repassword" class="w330" placeholder="6-18位大小写字母或者数字" /></li>
							<li class="h30"><span class="check-btn mod-sprites ml100"><input type="checkbox" /></span><span class="agree">我已同意</span>
								<a href="" class="rule">[轻松结婚用户协议]</a>
							</li>
							<li><button class="reg-btn w170 h50 ml100" id="register">注册</button>
								<a href="login.html" class="rule fr unl">已有账号登录</a>
							</li>
						</ul>
					</form>
				</div>
				<div class="other-login">
					<h1 class="reg-txt mt20 tc">第三方账号登录</h1>
					<div class="other-login-logo">
						<a href="" class="reg-txt"><i class="mod-sprites w50 h50 qq-img"></i> QQ登录
							</span>
						</a>
						<a href="" class="reg-txt"><i class="mod-sprites w50 h50 wx-img"></i>
							<span>微信登录</span></a>
						<a href="" class="reg-txt"><i class="mod-sprites w50 h50 wb-img"></i>
							<span>微博登录</span></a>
					</div>
				</div>
			</div>
		</div>
		<script src="../js/mod/jquery-1.9.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			/*验证码*/
			var yzm = null;
			$("#register").click(function() {
				if(!$(".check-btn input").is(":checked"))
				{
					alert("你没有勾选轻松结婚用户协议");
					return false;
				}
				var loginData =setJson($("#register-form"));
				
				if(!/^[1](3|5|8|4|7)\d{9}$/.test(loginData.phonenum)) {
					alert("手机号格式不对");
					return false;
				}
				if(!/^[a-zA-Z0-9]{6,18}$/.test(loginData.password)) {
					alert("密码格式不对，6到18位大小写和数字");
					return false;
				}
				if(loginData.password!=loginData.repassword){
					alert("2次输入的密码不一致");
					return false;
				}
				if(loginData.phonever!=yzm){
					alert("验证码输入有误！")
					return false;
				}
				/*验证通过后ajax请求*/
				$.ajax({
					type: "post",
					url: "http://xhwed.com/xhwed.php/LoginRegistr/Enroll",
					datatype: "json",
					data: loginData,
					async: true,
					success: function(data) {
						data = JSON.parse(data);
						if(data.msg=="success")
						{
							alert("注册成功！确认后跳转到登录页面");
							setTimeout(function(){
								window.location.href="login.html";
							},2000)
						}
					}
				});
				return false;
			});
			/*选中协议按钮*/
			$(".check-btn").click(function() {
				if($(this).children("input").is(":checked")) {
					$(this).addClass("check-active");
				} else {
					$(this).removeClass("check-active");
				}
			});

			/*获取验证码点击*/
			$("#hqyzm").click(function() {
				//console.log($("#register-form").serializeArray()[0]);
				var mydata = setJson($("#register-form"));
				console.log(mydata);
				console.log(mydata);
				var reg = /^[1](3|5|8|4|7)\d{9}$/;
				if(reg.test(mydata.phonenum)) {
					//console.log(mydata);
					/*手机号匹配成功*/
					rePhone(getVerifi);
				} else alert("手机号格式错误");
			});
			
			/*获取验证码*/
			function getVerifi(){
				var mydata = setJson($("#register-form"));
				$.ajax({
						type: "post",
						url: "http://xhwed.com/xhwed.php/LoginRegistr/smsRegistr",
						datatype: "json",
						data: mydata,
						async: true,
						success: verAjax
					});
			}
			/*获取手机验证码*/
			function verAjax(data) {
				data = JSON.parse(data);
				if(data.msg == "fail") {
					alert("验证码发送失败" + data.result);
				} else {
					yzm = data.result;
					$("#hqyzm").removeClass("reg-btn").addClass("reg-checked");
					$("#hqyzm").text("60s");
					$("#hqyzm").attr("disabled", true);
					/*定时器*/
					var varTime = setInterval(function() {
						var i = 60;
						return function() {
							i--;
							$("#hqyzm").text(i + "s");
							if(i <= 0) {
								clearInterval(varTime);
								$("#hqyzm").removeClass("reg-checked").addClass("reg-btn");
								$("#hqyzm").text("获取验证码");
								$("#hqyzm").attr("disabled", false);
							}
						}
					}(), 1000);
				}
			}
			/*设置表单数据转json*/
			function setJson($jq) {
				var data = {};
				$jq.serializeArray().map(function(x) {
					data[x.name] = x.value;
				});
				return data;
			}
			
			/*判读手机号码是否重复*/
			$("#phonenum").blur(function() {
				rePhone();
			});
			/*判断是否重复*/
			function rePhone(method){
				var mydata = setJson($("#register-form"));
				var reg = /^[1](3|5|8|4|7)\d{9}$/;
				console.log(mydata);
				if(reg.test(mydata.phonenum)) {
				 $.ajax({
				 	type:"post",
				 	url:"http://xhwed.com/xhwed.php/LoginRegistr/JudgeNumber",
				 	async:true,
				 	data:mydata,
				 	success:function(data){
				 		var data =JSON.parse(data);
				 		console.log(data);
				 		if(data.msg=="fail")
				 		{
				 			alert("账号已经被注册！");
				 			$("#phonenum").text("");
				 		}
				 		if(data.msg=="success"){
				 			if(method){
				 				method();
				 			}
				 		}
				 	}
				 });	
				}
			}
		</script>

	</body>

</html>